<template>
    <h2>用户注册页面</h2>
    <table class="table-bordered" border="1">
        <tr>
            <td>用户名</td>
            <td>
                <input type="text" v-model="Info.UserName" placeholder="请输入用户名" />
            </td>
        </tr>
        <tr>
            <td>密码</td>
            <td>
                <input type="password" v-model="Info.UserPwd" placeholder="请输入密码" />
            </td>
        </tr>
        <tr>
            <td colspan="2">
            <input type="button" value="注册" class="btn btn-primary" @click="AddUSer" />
            </td>
        </tr>
    </table>
    
    
    </template>
    
    
    <script setup lang="ts">
    import { ref } from 'vue';
    import { useRouter } from 'vue-router';
    import axios from 'axios';

    const Info = ref({
        UserName: '',
        UserPwd: '',
    });
    const router = useRouter();

    const AddUSer = ()=>{
        //用户名和密码非空

        if(Info.value.UserName==""||Info.value.UserPwd==""){
            alert("用户名和密码不能为空");
            return;
        }
        axios.post("http://localhost:61413/api/User/AddLogin",{
                UserName:Info.value.UserName,
                UserPwd:Info.value.UserPwd
        })
        .then(res=>{
            if(res.data>0){
            alert("注册成功");
            router.push('/login');        
            }else if(res.data==-1){
                alert("用户名已存在");
            }else{
                alert("注册失败")
            }
        })
    }
    
    </script>